import React,{Component} from 'react'
import {Icon} from 'antd'
import {withRouter} from 'react-router-dom'
import * as api from '../../api/cart'
import * as user from '../../api/userInfo'
import { Modal, message } from 'antd';
const { confirm } = Modal;
 class SizeSelector extends Component{
    constructor(props){
        super(props)
        this.state={
            id:''
        }
    }
    add(msg){
        console.log(localStorage.getItem('token'))
        user.UserInfo().then(data=>{
            this.setState({
                id:msg
            })
            api.addCart({product:msg,quantity:1 }).then((data)=>{
                confirm({
                  title: '加入成功',
                  content: '请确认是否跳转到购物车',
                  onOk() {
                    window.location.href="#/cart/checkbag"
                  },
                  onCancel() {
                    console.log('Cancel');
                  },
                });
            })
        }).catch(()=>{
            console.log(1)
            confirm({
              title: '温馨提示',
              content: '请先登录，再加入你心仪的商品',
              onOk() {
                window.location.href="#/login"
              },
              onCancel() {
                console.log('Cancel');
              },
            });
        })

    }
    confirm(e) {
       window.location.href="#/cart/checkbag" 
     }
    render(){
        let list=this.props.name
        console.log(list._id)
        return(
            <div className="sizeSelector">
                <h2>TRENDIANO</h2>
                <dl>
                   <dt>{list.name}</dt> 
                   <dd>￥{list.price}</dd>
                </dl>
                <div class="size">
                    <span>尺码</span>
                </div>
                <p style={{marginTop:'20px'}}>
                    <a>一键购买</a>
                    <a><Icon theme='' style={{color:'rgb(168, 130, 47)',marginRight:'3px',fontWeight:'bold'}} type="heart" />加入收藏</a>
                    <a><Icon style={{color:'rgb(168, 130, 47)',marginRight:'3px',fontWeight:'bold'}} type="message" theme="filled" />联系客服</a>
                </p>
                <p style={{textDecoration:'underline'}}>单笔消费满699元包邮</p> 
                <a onClick={()=>this.add(list._id)} className="addCart" href="javascript:;">加入购物车</a>                    
                <p className="share" style={{textAlign:'right'}}>分享：<Icon type="weibo-circle" theme="filled" /><Icon type="qq-circle" theme="filled" /></p>
            </div>
        )
    }
}
export default withRouter(SizeSelector)
